<template>
    <div class="h-8 flex items-center border-b  mb-2">
        <el-breadcrumb separator="/">
            <el-breadcrumb-item
                v-for="(tab, index) in tabs" v-if="!tab.current || $route.name == tab.name" :key="index"
                :class="{active: $route.name == tab.name }" :to="{ name: tab.name,params:tab.params }">
                <span class="cursor-pointer">{{ tab.title }}</span>
            </el-breadcrumb-item>
        </el-breadcrumb>
    </div>
</template>

<script>
export default {
    props: ['tabs'],
    methods: {
        goBack() {

        }
    }
}
</script>

<style scoped>
.active {
    color: red !important;
}

</style>
